<template>
  <div class="fieldList">
    <el-card >
   <ElementEasyForm ref="comFromRef" class="mt20" :formJson="formJson">


    </ElementEasyForm>
  <div class="aic jcc mt20">
     <el-button type="primary" @click="handleDesign">保存</el-button>
  </div>
  </el-card>

  </div>
</template>

<script setup lang="ts">
import { ref, reactive, getCurrentInstance, onMounted, shallowRef, toRaw, nextTick } from "vue";
import {
userTableFields,
} from '../mock/index'
import { loadAsyncComponent } from "/@ts/plugins/components";
import { useRouter, useRoute} from "vue-router";
import { routerOpenPage } from "/@ts/hooks/route";

const userTable = ref(userTableFields);
const formJson = ref<any>({
  "rowAttrs": {
    "gutter": 0,
    "justify": "start",
    "align": "middle"
  },
  "schema": [
    {
      "label": "删除传递字段",
      "type": "COMPONENT",
      "formItemAttrs": {},
      "attrs": {
        "placeholder": "请输入",
        "type": "text"
      },
      "rules": [],
      "prop": "CarolKarenThompson",
      "componentName": "ElSelect",
      "hidden": {
        "matchPattern": "&&",
        "type": "select",
        "dataSelect": [],
        "value": false,
        "dataJs": "function hidden(config,data){\n        return false;\n      }"
      },
      "colAttrs": {
        "span": 12,
        "offset": 0,
        "push": 0,
        "pull": 0
      },
        "children": userTable.value.map((item) => {
          return {
            "type": "COMPONENT",
            "componentName": "ElOption",
              "attrs": {
            "label": item.label,
            "value": item.prop
          },
           
          }
        })
    },
    {
      "label": "删除提示语",
      "type": "COMPONENT",
      "formItemAttrs": {},
      "attrs": {
        "placeholder": "请输入",
        "type": "text"
      },
      "rules": [],
      "prop": "BrianAmyAnderson",
      "componentName": "ElInput",
      "hidden": {
        "matchPattern": "&&",
        "type": "select",
        "dataSelect": [],
        "value": false,
        "dataJs": "function hidden(config,data){\n        return false;\n      }"
      },
      "colAttrs": {
        "span": 12,
        "offset": 0,
        "push": 0,
        "pull": 0
      }
    }
  ],
  "model": {
    "CarolKarenThompson": "",
    "BrianAmyAnderson": ""
  },
  "formAttrs": {
    "hide-required-asterisk": false,
    "inline-message": false,
    "status-icon": false,
    labelWidth: "100px",
    "scroll-to-error": false
  }
});
        const handleSave = () =>{
        }
onMounted(() => {
});
</script>

<style scoped lang="scss">
.fieldList{
}
</style>
